<template>
  <div style="display: flex;flex-direction: column;gap: 20px">
    <div class="btn-group-inline">
      <t-button

        @click="
          dialog.objId = 0;
          dialog.header = '添加研究成果';
          dialog.open = true;
        "
        variant="outline"
        theme="primary"
      >
        <t-icon name="add" slot="icon" />
        添加
      </t-button>
      <t-button  @click="editData" variant="outline" theme="primary">
        <t-icon name="edit-1" slot="icon" />
        修改
      </t-button>
      <t-button  @click="delData" variant="outline" theme="primary">
        <t-icon name="delete" slot="icon" />
        删除
      </t-button>
    </div>
    <t-table
      rowKey="id"
      :data="data"
      :columns="columns"
      bordered
      hover
      :loading="dataLoading"
      :selected-row-keys="selectedRowKeys"
      @select-change="rehandleSelectChange"
    >
      <template #hot="{ row: { hot } }">
        {{ hot ? '是' : '否' }}
      </template>
    </t-table>
    <add-edit-result
      @reload="getList()"
      :header="dialog.header"
      :expertId="objId"
      :objId="dialog.objId"
      :visible.sync="dialog.open"
      v-if="dialog.open"
    />
  </div>
</template>

<script>
import AddEditResult from './components/add-edit-expert-result.vue';

export default {
  name: 'expert-result',
  components: { AddEditResult },
  props: ['objId'],
  data() {
    return {
      selectedRowKeys: [],
      dataLoading: false,
      data: [],
      columns: [
        { colKey: 'row-select', type: 'single', title: '选择', width: 64 },
        { colKey: 'id', title: '成果序号', align: 'center' },
        { colKey: 'content', title: '标题/作者/来源/收录', align: 'center' },
        { colKey: 'type', title: '类别', align: 'center' },
        { colKey: 'influence', title: '期刊影响因子', align: 'center' },
        { colKey: 'hot', title: '高被引论文（是否）', align: 'center' },
      ],
      rawColumns: [
        {
          colKey: 'index',
          title: '成果序号',
          align: 'center',
          width: 90,
        },
        {
          colKey: 'content',
          title: '标题/作者/来源/收录',
          align: 'center',
        },
        {
          colKey: 'type',
          title: '成果类别',
          align: 'center',
        },
        {
          colKey: 'influence',
          title: '期刊影响因子',
          align: 'center',
        },
        {
          colKey: 'isHot',
          title: '高被引论文（是否）',
          align: 'center',
        },
        {
          colKey: 'isHot1',
          title: '科研之友导入（是否）',
          align: 'center',
        },
        {
          colKey: 'isHot3',
          title: '数据完整性',
          align: 'center',
        },
        {
          colKey: 'op',
          title: '操作',
          align: 'center',
        },
      ],
      dialog: {
        open: false,
        objId: 0,
        header: '',
      },
    };
  },
  watch: {
    objId: {
      immediate: true,
      handler(val) {
        if (val) {
          this.getList();
        }
      }
    }
  },
  methods: {
    getList() {
      this.dataLoading = true;
      this.$api.zjk.expert
        .expertAchievementGetByExpertId(this.objId)
        .then((response) => {
          this.dataLoading = false;
          this.data = response.data;
        })
        .catch((e) => {
          this.dataLoading = false;
          this.$message.error(e.toString());
        });
    },
    rehandleSelectChange(val) {
      this.selectedRowKeys = val;
    },
    delData() {
      if (this.selectedRowKeys.length <= 0) {
        this.$message.warning('请选择一行');
        return;
      }
      const obj = this.data.find((val) => val.id === this.selectedRowKeys[0]);
      const confirmDia = this.$dialog.confirm({
        header: '系统提示',
        body: `是否确认删除成果编号为"${obj.id}"的数据项？`,
        theme: 'warning',
        onConfirm: () => {
          confirmDia.update({
            confirmBtn: {
              loading: true,
            },
          })
          this.$api.expert
            .expertAchievementDel(obj.id)
            .then(() => {
              this.getList();
              this.$message.success('删除成功');
              // 请求成功后，销毁弹框
              confirmDia.destroy();
            })
            .catch((e) => {
              confirmDia.update({
                confirmBtn: {
                  loading: false,
                },
              })
              this.$message.error(e.toString());
            });
        },
      });
    },
    editData() {
      if (this.selectedRowKeys.length <= 0) {
        this.$message.warning('请选择一行');
        return;
      }
      const obj = this.data.find((val) => val.id === this.selectedRowKeys[0]);
      this.dialog.header = '修改研究成果';
      this.dialog.objId = obj.id;
      this.dialog.open = true;
    },
  },
};
</script>

<style scoped></style>
